<!DOCTYPE html>
<html lang="en">
<head>
    <title>购买保险</title>
    <script src="/js/jquery-1.11.0.min.js"></script>
    <script src="/js/jquery.validation/1.14.0/jquery.validate.min.js"></script>
    <script src="/js/jquery.validation/1.14.0/messages_zh.min.js"></script>
    <script src="/js/layer/layer.js" charset="utf-8"></script>
    <style type="text/css">
        input[id="i-name"].error, input[id="l-name"].error, input[id="m-name"].error {
            border: 1px solid red;
        }
        .hidden-contenxt{
            height: 600px;
            overflow: auto;
        }
    </style>
</head>
<body>
<section id="container">
<#include "sider.ftl">  <#--引入 头部和导航栏-->
    <section id="main-content">
        <section class="wrapper">
            <div class="form-w3layouts">
                <!-- page start-->
                <div class="row">
                    <div class="col-lg-12">
                        <section class="panel">
                            <header class="panel-heading">
                                购买保险
                            </header>
                            <div class="panel-body" style="width: 1300px; margin: 0 auto;">
                                <form class="form-horizontal" id="buyInsuranceForm">
                                    <div class="form-group has-success">
                                        <label class="col-lg-3 control-label">*客户证件号：</label><span id="cardmsg"></span>
                                        <div class="col-lg-6">
                                            <input type="text" id="i-name" name="idcard" class="form-control">
                                        </div>
                                    </div>
                                    <div class="form-group has-success">
                                        <label class="col-lg-3 control-label">*车牌号：</label></span><span id="carmsg"></span>
                                        <div class="col-lg-6">
                                            <select class="form-control" name="carid" id="carid">
                                            </select><span id="carmsg"></span>
                                        </div>
                                    </div>
                                    <div class="form-group has-success">
                                        <label class="col-lg-3 control-label">*保险套餐：</label>
                                        <div class="col-lg-6 hidden-contenxt">
                                            <table class="table" id="combo">
                                                <tr>
                                                    <td class="info">选择</td>
                                                    <td width="200px" class="success">套餐类型</td>
                                                    <td class="danger">所含保险</td>
                                                </tr>
                                            </table>
                                        </div>
                                    </div>
                                    <div class="form-group has-success">
                                        <label class="col-lg-3 control-label">*应付金额：</label>
                                        <div class="col-lg-6">
                                            <input type="text" name="paymoney" id="m-name" class="form-control">
                                        </div>
                                    </div>
                                    <div class="form-group has-success">
                                        <label class="col-lg-3 control-label">*支付状态：</label>
                                        <div class="col-lg-6">
                                            <select name="paystate" id="paystate" class="form-control">
                                                <option value="0">未缴费</option>
                                                <option value="1">已缴费</option>
                                            </select>
                                        </div>
                                    </div>
                                    <div class="form-group has-success">
                                        <label class="col-lg-3 control-label">*支付方式：</label>
                                        <div class="col-lg-6">
                                            <select name="paymethod" id="paymethod" class="form-control">
                                                <option value="0">未缴费</option>
                                                <option value="1">支付宝</option>
                                                <option value="2">微信</option>
                                                <option value="3">现金</option>
                                                <option value="4">银行卡</option>
                                            </select>
                                        </div>
                                    </div>
                                    <div class="form-group has-success">
                                        <label class="col-lg-3 control-label">备注：</label>
                                        <div class="col-lg-6">
                                            <textarea class="form-control" id="remark"
                                                      style="width: 620px;height: 100px"></textarea>
                                        </div>
                                    </div>
                                    <div class="form-group">
                                        <div class="col-lg-offset-3 col-lg-6">
                                            <button class="btn btn-primary" type="button" id="submitBtn">提交</button>
                                            <button class="btn btn-default" type="button" id="returnBtn">返回</button>
                                        </div>
                                    </div>
                                </form>
                            </div>
                        </section>
                    </div>
                </div>
            </div>
        </section>
    <#include "foot.ftl"><#--引入底部-->
    </section>
</section>
</body>
</html>
<script type="text/javascript">
    /////获取当前 输入的用户的uuid
    var suId = null;
    /////获取当前输入的 车辆的 uuid
    var caruuid = null;

    ////判断该用户信息是否在系统中
    var getDetailInfo = function () {
        $.ajax({
            url: "/order/getOrderByUserAndCars",
            type: 'post',
            dataType: "json",
            data: {
                scardId: $("#f-name").val(),
                licenseNum: $("#l-name").val(),
            },
            success: function (data) {
                /* console.log(data);*/
                if (data.code == 100002) {
                    $("#msg").html("该客户已经为此爱车购买过保险<a href='/order/toGetDetails'>点此查看</a>");
                } else if (data.code == 100001) {
                    $("#msg").html("客户还未录入信息，请先<a href='#'>录入客户信息</a>");
                }
            }
        });
    };
    ////校验用户信息是否存在系统
    $("#i-name").blur(function () {
        $("#carid").html(" ");
        $.ajax({
            type: "post",
            dataType: "json",
            url: "/order/getUserByIdCard",
            data: {
                idcard: $("#i-name").val()
            },
            success: function (data) {
                if (data.message == "false") {
                    $("#cardmsg").html("请先<a href='/user/add_User' id='addUser'>添加客户信息</a>");
                } else {
                    $("#cardmsg").html(" ");
                    suId = data.message;
                    getCarByUser(suId);
                }
            }
        });
    });
    var licensenum;
    var getCarByUser=function(suId){
        $.ajax({
            type:"post",
            url:"/order/getCarsByUser",
            data:{
                suId:suId
            },
            success:function (data) {
                if (data==null||data==""){
                    $("#carid").html(" ");
                    $("#carmsg").html("<a href='/cars/addFirst'>添加车辆信息</a>");
                }else{
                    $("#carmsg").html(" ");
                    $(".oldOption").remove();
                    $.each(data,function (index,obj) {
                        licensenum=obj.licenseNum;
                        var newoption="<option class='oldOption' value='"+obj.carUuid+"'>"+obj.licenseNum+"</option>";
                        $("#carid").append(newoption);
                    });
                }

            }
        });
    };
    ////获取当前所有套餐 以及套餐中的 保险
    var comuuid;
    $.ajax({
        url: "/order/getAllCombo",
        dataType: "json",
        type: "post",
        success: function (data) {
            $.each(data, function (index, obj) {
                var newtr = " <tr><td><input type='radio' value='" + obj.comuuid + "' class='combotype' name='combo'></td><td width='100px'>" + obj.combname + "</td><td><table  class='" + obj.comuuid + " table'></table></td></tr>";
                $("#combo").append(newtr);
                $.each(obj.list, function (index, object) {
                    var newtable = "<tr><td>" + object.insurname + "</td></tr>";
                    $("." + obj.comuuid + "").append(newtable);
                })
            })
            $(".combotype").click(function () {
                if (licensenum==null||licensenum==""){
                    layer.msg("请添加车辆信息",{icon:2});
                }else {
                    comuuid=$(this).val();
                    getComboPrice(comuuid);
                }

            });
        }
    });
    var getComboPrice=function (comuuid) {
        $.ajax({
            url: "/order/getComboPrice",
            dataType: "json",
            type: "post",
            data:{
                comuuid:comuuid,
                licensenum:licensenum
            },
            success:function (data) {
                $("#m-name").val(data);
            }
        });
    };


    var submitInfo = function () {
        if (!check().form()) {
            return;
        }
        $.ajax({
            url: "/order/buyInsurance",
            type: "post",
            dataType: "json",
            data: {
                uid: suId,
                caruid: $("#carid").val(),
                paystate: $("#paystate").val(),
                paymethod: $("#paymethod").val(),
                comuuid:comuuid,
                oremark: $("#remark").val(),
                paymoney: $("#m-name").val()
            },
            success: function (data) {
                if (data) {
                    layer.msg("下单成功....", {icon: 6});
                    setTimeout("location.href='/order/toOrderQuery'", 2000);
                } else {
                    layer.msg("下单失败或已有订单，请重试", {icon: 6});
                }

            }
        });
    };
    $("#submitBtn").click(function () {
        submitInfo();
    });
    $("#returnBtn").click(function () {
        window.history.go(-1);
    });

    function check() {
        var ids=document.getElementsByName("combo");
        var flag=false;
        for (var i=0;i<ids.length;i++){
            if (ids[i].checked){
                flag=true;
                break;
            }
        }
        if (!flag){
            layer.msg("请选择保险套餐！",{icon:6});
            return false;
        }
        jQuery.validator.addMethod("regex", function (value, element, params) {
            var exp = new RegExp(params);
            return exp.test(value);
        }, "格式错误");
        return $("#buyInsuranceForm").validate({
            rules: {
                idcard: {
                    required: true
                },
                carid: {
                    required: true
                },
                paymoney: {
                    required: true,
                }
            },
            messages: {
                idcard: {
                    required: ""
                },
                carid: {
                    required: ""
                },
                paymoney:{
                    required:"",
                }
            }
        });
    };
</script>